<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"    
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <ui:composition template="ClientTemplate.xhtml">   
        <ui:define name="body">  
            <h:form>
                <p:panel>              
                    <p:panelGrid columns="3" id="grid" >
                        <f:facet name="header">
                            <b class="blue">Sing Up</b>
                        </f:facet>

                        <h:outputLabel value="Name " for="usName" />
                        <p:inputText styleClass="register" id="usName" value="#{userController.selected.usName}" title="Name" 
                                     required="true" requiredMessage="The Name field is required"/>
                        <p:message id="NameMessage" for="usName" display="text"/> 

                        <h:outputLabel value="UserName " for="usUserName" /> 
                        <p:inputText styleClass="register" id="usUserName" value="#{userController.selected.usUserName}" title="UserName" 
                                     required="true" requiredMessage="The UserName field is required">                        
                            <f:validateLength minimum="6" maximum="10" /> 
                        </p:inputText>
                        <p:message id="UserNameMessage" for="usUserName" display="text"/> 

                        <h:outputLabel value="Password " for="usPassword" />
                        <p:password styleClass="register" id="password1" match="password2" feedback="false" value="#{userController.selected.usPassword}" title="Password" 
                                    required="true" requiredMessage="The Password field is required">
                            <f:validateLength minimum="6" maximum="10" />
                        </p:password>
                        <p:message id="passwordMessage" for="password1" display="text"/>

                        <h:outputLabel value="Password Confirm " for="usPassword" />
                        <p:password styleClass="register" id="password2" feedback="false" value="#{userController.selected.usPassword}" title="Password" 
                                    required="true" requiredMessage="The Password Confirn field is required"/>                     
                        <p:message id="passwordMessage2" for="password2" display="text"/>  

                        <h:outputLabel value="Email" for="usEmail" />
                        <p:inputText styleClass="register" id="usEmail" value="#{userController.selected.usEmail}" title="Email" required="true" 
                                     requiredMessage="The Email Confirn field is required">
                            <!-- viết biểu thức phù hợp -->
                            <!--  <f:validateRegex pattern="^[a-zA-Z]" /> -->
                        </p:inputText>
                        <p:message id="usEmailMessage" for="usEmail" display="text"/> 

                        <h:outputLabel value="Address " for="usAdress" />
                        <p:inputText styleClass="register" id="usAdress" value="#{userController.selected.usAdress}" title="Address" />
                        <h:panelGroup/>

                        <h:outputLabel value="Phone " for="usPhone" />
                        <p:inputText styleClass="register" id="usPhone" value="#{userController.selected.usPhone}" title="Phone" required="true" 
                                     requiredMessage="The Phone field is required.">
                            <!-- viết biểu thức phù hợp (chỉ được nhập sô -->
                            <!-- <f:validateRegex pattern="^[a-zA-Z]" /> -->
                        </p:inputText>
                        <p:message id="phoneMessage" for="usPhone" display="text"/> 

                        <h:outputLabel value="Company " for="usCompany" />
                        <p:inputText styleClass="register" id="usCompany" value="#{userController.selected.usCompany}" title="Company" />
                        <h:panelGroup/>

                        <h:outputLabel value="Status " for="usStatus" />
                        <p:selectOneRadio id="usStatus" value="#{userController.selected.usStatus}" >  
                            <f:selectItem itemLabel="True" itemValue="1" />  
                            <f:selectItem itemLabel="False" itemValue="0" /> 
                        </p:selectOneRadio> 
                        <h:panelGroup/>

                        <f:facet name="footer">
                            <p:commandButton styleClass="button1 blue"
                                             action="#{userController.create}"
                                             value="Save" icon="ui-icon-check"
                                             update="grid" /> 
                        </f:facet>

                    </p:panelGrid>

                </p:panel>
            </h:form>
        </ui:define>
    </ui:composition>
</html>

